<template>
  <div>
    <!-- 资质信息 -->
    <curd-title v-if="infoFlg" :required="!['view'].includes(this.type)" :title="'资质信息'" />
    <avue-crud
      :table-loading="Loading"
      :option="option"
      :data="data"
      v-model="form"
      @on-load="onLoad"
      @row-save="rowSave"
      @row-update="rowUpdate"
      @refresh-change="refreshChange"
      @row-del="rowDel"
      :row-class-name="delRowClassName"
    >
      <template slot="attachments" slot-scope="scope">
        <easy-upload v-model="scope.row.attachVOS" view-with-count :disabled="['view'].includes(type)"/>
      </template>
      <template slot="attachmentsForm">
        <easy-upload style="display: inline" :drag="false" upload-text="点击上传" v-model="form.attachVOS" multiple />
      </template>
      <template slot="name" slot-scope="scope">
        <div v-if="slotFlg">
          <del v-if="scope.row.nameFlag === '1'">{{ scope.row.name }}</del>
          {{ scope.row.nameA }}
        </div>
        <span v-else>{{ scope.row.name }}</span>
      </template>
      <template slot="certificationAuthority" slot-scope="scope">
        <div v-if="slotFlg">
          <del v-if="scope.row.certificationAuthorityFlag === '1'">{{ scope.row.certificationAuthority }}</del>
          {{ scope.row.certificationAuthorityA }}
        </div>
        <span v-else>{{ scope.row.certificationAuthority }}</span>
      </template>
      <template slot="signDate" slot-scope="scope">
        <div v-if="slotFlg">
          <del v-if="scope.row.signDateFlag === '1'">{{ scope.row.signDate }}</del>
          {{ scope.row.signDateA }}
        </div>
        <span v-else>{{ scope.row.signDate }}</span>
      </template>
      <template slot="validDate" slot-scope="scope">
        <div v-if="slotFlg">
          <del v-if="scope.row.validDateFlag === '1'">{{ scope.row.validDate }}</del>
          {{ scope.row.validDateA }}
        </div>
        <span v-else>{{ scope.row.validDate }}</span>
      </template>
    </avue-crud>
  </div>
</template>

<script>
import { qualificationOption } from '@/option/tenant/supplier/qualification-info'
import CurdTitle from '@/components/base/title'
import { getList, remove, add, update } from '@/api/supplier/qualification'
import { getStore } from '@/util/store'
import delRowClassName from '@/views/plugin/workflow/mixins/info'

export default {
  name: 'QualificationInfo',
  components: { CurdTitle },
  inject: {
    type: {
      default: 'view'
    },
    infoFlg: {
      default: true
    },
    slotFlg: {
      default: false
    }
  },
  mixins: [delRowClassName],
  data() {
    return {
      Loading: false,
      supplierId: getStore({ name: 'supplierId' }),
      form: {
        files: [
          // {
          //   status: 'success',
          //   name: 'upload/20220321/5c3b0210a1bf1ec4634dcc41b649e3be.jpeg',
          //   size: 79104,
          //   percentage: 100,
          //   uid: 1647831024615,
          //   raw: {
          //     uid: 1647831024615
          //   },
          //   link: 'http://39.101.163.248:9000/bladex/upload/20220321/5c3b0210a1bf1ec4634dcc41b649e3be.jpeg',
          //   domain: 'http://39.101.163.248:9000/bladex',
          //   originalName: '2f23348cf9d68004bd114c9474907bc7.jpeg',
          //   attachId: '1505738809846853633'
          // }
        ]
      },
      data: [],
      files: [],
      option: qualificationOption.call(this)
    }
  },
  methods: {
    refreshChange() {
      this.onLoad()
    },
    onLoad() {
      this.infoFlg
        ? ((this.loading = true),
          getList({ supplierId: this.supplierId }).then(res => {
            const data = res.data.data
            this.data = data.map(item => ({ ...item, attachments: item.attachments || [] }))
            this.loading = false
          }))
        : ''
    },
    rowSave(row, done, loading) {
      add({ ...row, supplierId: this.supplierId }).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
          done()
        },
        error => {
          window.console.log(error)
          loading()
        }
      )
    },
    rowUpdate(row, index, done, loading) {
      // console.log(row.files)
      // console.log(typeof(row.files))
      row.attachments =
        !!row.files && typeof row.files === 'object'
          ? row.files.map(i => {
              return i.response.data
            })
          : []
      // console.log(row.attachments)

      update(row).then(
        () => {
          this.onLoad(this.page)
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
          done()
        },
        error => {
          window.console.log(error)
          loading()
        }
      )
    },
    rowDel(row) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(row.id)
        })
        .then(() => {
          this.onLoad(this.page)
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
        })
    }
  }
}
</script>

<style></style>
